<template>
	<el-dialog :title="title" v-model="dialogVisible" class="redius8" width="1200" center :before-close="handleClose">
		<div class="relative">
			<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
				<el-tab-pane label="正常品" name="1001">
					<tab1 :activeName="activeName" @getValue="getValue" :idArr="idArr"></tab1>
				</el-tab-pane>
				<el-tab-pane label="促销品" name="1003">
					<tab1 :activeName="activeName" @getValue="getValue" :idArr="idArr"></tab1>
				</el-tab-pane>
				<el-tab-pane label="试验品" name="1002">
					<tab1 :activeName="activeName" @getValue="getValue" :idArr="idArr"></tab1>
				</el-tab-pane>
			</el-tabs>
			<div class="absolute" style="right: 0;top: 15px;">
				<el-button type="defaultBtn" @click="handleAdd">确认添加</el-button>
			</div>
		</div>
	</el-dialog>	
</template>

<script>
	import tab1 from "./components/tab1.vue"
	// import tab2 from "./components/tab2.vue"
	// import tab3 from "./components/tab3.vue"
	export default{
		components:{
			tab1,
			// tab2,
			// tab3
		},	
		props:{
			idArr:{
				type:Array,
				default:res=>{
					return []
				}
			}
		},
		data(){
			return{
				title:'',
				dialogVisible:false,
				activeName:'1001',
				giftIds:[],//赠品id
			}
		},
		methods:{
			handleClose(){
				this.dialogVisible = false
			},
			open(num){
				if(num == 1){
					this.title = '添加商品'
				}else{
					this.title = '添加赠品'
				}
				this.dialogVisible = true
			},
			getValue(e){
				this.giftIds = e
			},
			handleAdd(){
				if(this.giftIds.length == 0){
					this.$modal.msgError("请选择商品");
					return false;
				}
				this.$emit('getGift',this.giftIds)
				this.handleClose()
				// localStorage.setItem('giftIds', JSON.stringify(this.giftIds));
				// // 返回上一页
				// this.$router.back();
				// this.$tab.closePage();
			}
		}
	}
</script>

<style>
	.right-btn {
		position: absolute;
		right: 30px;
		bottom: 10px;
	}
	.demo-tabs .el-tabs__item{
		padding: 30px 20px;
	}
</style>